<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>个人介绍网站</title>
    <link rel="stylesheet" href="styles.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
</head>
<body>
    <header>
        <nav>
            <ul>
                <li><a href="#about-me">关于我</a></li>
                <li><a href="#skills">技能</a></li>
                <li><a href="#projects">项目</a></li>
                <li><a href="#contact">联系我</a></li>
            </ul>
        </nav>
    </header>
    <main>
        <section id="about-me">
            <h2>关于我</h2>
            <div class="about-content">
                <img src="your-photo.jpg" alt="个人照片" class="profile-photo">
                <div class="about-text">
                    <p>你好，我是一个热爱编程和设计的人，喜欢探索新技术和解决问题。我目前专注于软件开发，希望未来能成为一名优秀的全栈工程师。</p>
                    <p>我擅长使用HTML、Java、C++和Python进行开发，同时也对前端和后端技术有一定的了解。</p>
                </div>
            </div>
            <div class="about-menu-content">
                <div class="menu-item">
                    <h3>个人经历</h3>
                    <p>我有多年的技术开发经验，曾在多家知名公司担任软件工程师，负责多个大型项目的开发和维护。</p>
                </div>
                <div class="menu-item">
                    <h3>兴趣爱好</h3>
                    <p>除了编程，我还喜欢阅读、旅行和摄影。这些爱好帮助我保持好奇心和创造力。</p>
                </div>
            </div>
        </section>
        <section id="skills">
            <h2>我的技能</h2>
            <div class="skills-content">
                <div class="skill-item">
                    <i class="fab fa-html5"></i>
                    <p>HTML</p>
                </div>
                <div class="skill-item">
                    <i class="fab fa-java"></i>
                    <p>Java</p>
                </div>
                <div class="skill-item">
                    <i class="fab fa-python"></i>
                    <p>Python</p>
                </div>
                <div class="skill-item">
                    <i class="fab fa-cpp"></i>
                    <p>C++</p>
                </div>
            </div>
        </section>
        <section id="projects">
            <h2>我的项目</h2>
            <div class="projects-content">
                <div class="project-item">
                    <h3>项目1：视奸网站</h3>
                    <p>这是一个可以盯着我在干什么的网站，使用了Flask和Python，部署在CloudFlare Tunnels上。</p>
                    <a href="https://cr200j1052.dpdns.org" target="_blank">查看项目</a>
                </div>
                <div class="project-item">
                    <h3>项目2：郑武高铁2024</h3>
                    <p>一个简单的郑武高铁车次查询应用，使用了Vite来编写。</p>
                    <a href="https://zhengwu.pages.dev" target="_blank">查看项目</a>
                </div>
            </div>
        </section>
        <section id="contact">
            <h2>联系方式</h2>
            <div class="contact-content">
                <p>欢迎联系我：</p>
                <ul>
                    <li><i class="fas fa-envelope"></i> Email: tianyu@cr200j1052.dpdns.org</li>
                    <li><i class="fab fa-qq"></i> QQ: 3941981723</li>
                    <li><i class="fab fa-github"></i> GitHub: <a href="https://github.com/tianyuzpr" target="_blank">我的GitHub</a></li>
                    <br/>
                    <br/>
                </ul>
            </div>
        </section>
    </main>
    <footer>
        <p>&copy; 2025 tianyu</p>
    </footer>
    <script src="script.js"></script>
</body>
</html>